<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>博客管理</title>
  <!--  公共头部-->
  <div th:replace="admin/common :: head"></div>
</head>
<body>


<!--公共导航-->
<div th:replace="admin/common :: menu(1)"></div>


  <div class="m-padded-tb-hugex">
  <div class="ui attached pointing menu">
    <div class="ui container">
      <div class="right menu">
        <a href="#" th:href="@{/admin/blog/input}" class=" item">新增</a>
        <a href="#" th:href="@{/admin/blog}" class="teal active item">列表</a>
      </div>
    </div>
  </div>
  </div>

  <br>
  <br>
  <br>

  <!--中间内容-->
  <div  class="">
    <div class="ui container">
      <div class="ui success message">
        <i class="close icon"></i>
        <div th:text="|提示： ${message}" class="">提示：操作成功！</div>
      </div>
      <form th:action="@{/admin/blog}" method="post">
      <div  class="ui secondary segment form">
        <div class="inline fields">
          <div class="field">
            <input type="text" th:value="${condition.title}" name="title" placeholder="标题">
          </div>
          <div class="field">
            <select name="typesId">
              <option th:value="0" th:selected="${condition.typesId} eq '' ">分类</option>
              <option class="item" th:selected="${condition.typesId==type.typesId}" th:each="type:${types}" th:value="${type.typesId}" th:text="${type.typesName}" data-value="1"></option>
            </select>
          </div>
          <div class="field">
            <button  type="submit" class="ui mini teal basic button"><i class="search icon"></i>搜索</button>
          </div>
        </div>
      </div>
      </form>
      <div id="table-container">
        <table class="ui compact teal table">
          <thead>
          <tr align="center">
            <th>ID</th>
            <th>标题</th>
            <th>类型</th>
            <th>推荐</th>
            <th>状态</th>
            <th>更新时间</th>
            <th>操作</th>
          </tr>
          </thead>
          <tbody>
          <tr th:each="blog,stats:${pager.datas}" align="center">
            <td th:text="${stats.count}">1</td>
            <td th:text="${blog.title}">mysql</td>
            <td th:text="${blog.typesName}">mysql</td>
            <td th:text="${blog.recommend_open} ? '推荐':'不推荐'">不推荐</td>
            <td th:text="${blog.flag}">原创</td>
            <td th:text="${blog.publish} ? '发布':'草稿'">草稿</td>
            <td>
              <a href="#" th:href="@{/admin/blog/modify(blogId=${blog.blogId})}" class="ui mini teal basic button">编辑</a>
              <a href="#" th:href="@{/admin/blog/delete(blogId=${blog.blogId})}"  onclick="return confirm('确定要删除该博客吗？请三思！')" class="ui mini red basic button">删除</a>
            </td>
          </tr>
          </tbody>
          <tfoot>
          <tr>
            <th colspan="8">
              <div class="ui inverted divided stackable grid">
                <div class="three wide column" align="center">
                  <a th:if="${pager.has_pre}" th:href="@{/admin/blog}" class="item">首页</a>&nbsp;&nbsp;&nbsp;
                  <a th:if="${pager.has_pre}" th:href="@{/admin/blog(page=${pager.page}-1)}" class="item">上一页</a>
                </div>

                <div class="ten wide column" align="center">
                  <p>第 <span th:text="${pager.page}"></span> 页，共 <span th:text="${pager.pages}"></span> 页，有 <span th:text="${pager.size}"></span> 篇文章</p>
                </div>

                <div class="three wide column" align="center">
                  <a th:if="${pager.has_next}" th:href="@{/admin/blog(page=${pager.page}+1)}" class="item">下一页</a>&nbsp;&nbsp;&nbsp;
                  <a th:if="${pager.has_next}" th:href="@{/admin/blog(page=${pager.last})}" class="item">末页</a>
                </div>
              </div>
              <div align="center">
              <div align="center">
                <a href="#" th:href="@{/admin/blog/input}">
                  <button type="button" class="ui teal button m-mobile-wide m-margin-top"><i class="pencil icon"></i>新增</button>
                </a>
              </div>
            </th>
          </tr>
          </tfoot>
        </table>



      </div>

    </div>
  </div>


  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>
  <br>

<!--公共底部栏-->
<div th:replace="admin/common :: #footer"></div>


<!--公共js-->
<div th:replace="admin/common :: #js"></div>
  <script>
    $('.menu.toggle').click(function () {
      $('.m-item').toggleClass('m-mobile-hide');
    });

    $('.ui.dropdown').dropdown({
      on : 'hover'
    });

    //消息提示关闭初始化
    $('.message .close')
      .on('click', function () {
        $(this)
          .closest('.message')
          .transition('fade');
      });

    $('#clear-btn')
      .on('click', function() {
        $('.ui.type.dropdown')
          .dropdown('clear');
      });

  </script>
</body>
</html>